
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>我的网站</title>
<style>
* { margin: 0; padding: 0;}
a{color: #000000;text-decoration: none;}
a:hover{color: #ff8587;}

.mytitle{text-align: center;}
#dowebok { width: 90%; margin: 0 auto; font-size: 18px;}
#dowebok li { float: left; width: 20%; margin-left: 1%; padding-top: 1%;}
#dowebok li img { width: 50%;}
#dowebok li .dt { width: 50%;text-align: center;}
#dowebok li{list-style-type: none;}
</style>
</head>

<body>
	<h1 class="mytitle">219970942 张轩珲</h1>
	<ul id="dowebok">
		<li>
			<div><img src="img/背景.jpg" src="img/背景.jpg" alt="图片1"></div>
			<div class="dt"><a href="zy2.1/zy2.1.html">作业1：打印图形</a></div>
		</li>
		<li>
			<div><img src="img/效果.png" src="img/效果.png" alt="图片2"></div>
			<div class="dt"><a href="img/domm1.html">练习2：使用DOM操纵图片</a></div>
		</li>
		<li>
			<div><img src="img/坦克.png" src="img/坦克.png" alt="图片3"></div>
			<div class="dt"><a href="img/tanke.html">练习3：用键盘操纵坦克移动</a></div>
		</li>
        <li>
			<div><img src="img/表格.png" src="img/表格.png" alt="图片4"></div>
			<div class="dt"><a href="zy4.html">练习4</a></div>
		</li>
        <li>
			<div><img src="img/广告.png" src="img/广告.png" alt="图片5"></div>
			<div class="dt"><a href="广告.html">实验4：广告</a></div>
		</li>
        <li>
			<div><img src="img/注册照片.png" src="img/注册照片.png" alt="图片6"></div>
			<div class="dt"><a href="img/注册界面.html">实验5：注册界面</a></div>
		</li>  
        <li>
			<div><img src="img/demo.png" src="img/demo.png" alt="图片7"></div>
			<div class="dt"><a href="jQuery demo.html">选择jQuery插件制作demo</a></div>
		</li>
        <li>
			<div><img src="img/游戏角色.png" src="img/游戏角色.png" alt="图片8"></div>
			<div class="dt"><a href="img/游戏角色.html">游戏角色</a></div>
		</li>
	</ul>

</body>
</html>